<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
<!--
如果设置了 id 或者 class 选择器,优先级会比元素的选择器要高
选择器的目的就是为了找到到底给谁设置样式
元素名是元素选择器
#id 是 id 选择器
.class 是类型选择器
-->
    <style type="text/css">
        p {
            color: red;
        }

        #firsth1 {
            color: blue;
        }

        #firsth12 {
            color: green;
        }

        .abc{
            color: bisque;
        }

        h1{
            color: red;
        }

        h2{
            color: blue;
        }
    </style>
</head>
<body>
<p>元素选择器 1</p>
<p>元素选择器 2</p>
<!--
注意 id 属性的值在同一个文件中不允许出现 2 次,是唯一的
-->
<h1 id="firsth1">这是 id 选择器</h1>
<h1 id="firsth12">这是 id 选择器2</h1>

<!--
class 是可以重复,也就是不同的标签可以使用同一个 class
-->
<h2 class="abc">这是h2 的内容 1,使用class 选择器</h2>
<h2 class="abc">这是h2 的内容 2,使用class 选择器</h2>
<h2>这个是没有 class 标签的 h2</h2>
</body>
</body>
</html>